import React, { useEffect, useState } from 'react';
import { Modal, Form, Space } from 'antd';
import FormCondition from '@/components/FormCondition';
import { connect } from 'umi';
const ClaimUser = (props) => {
    const { visible = false, onClose, loading, dispatch, pageType } = props;
    const { show = false, detail = {}, onChange } = visible;
    const { id } = detail;
    const [stageList, setStageList] = useState([])
    const [form] = Form.useForm();
    const type = {
        public: "public",
        independentCustomers: 'publicProtect',
        invalid: 'invalid'
    }[pageType]
    const fetchUserStage = () => {
        dispatch({
            type: 'user/fetchUserStageForChoose',
            payload: {
                organizationUserId: id,
                queryFor: type
            },
            callback: (e) => {
                const { stageInfoList = [] } = e
                setStageList(stageInfoList)
            }
        })
    }
    useEffect(() => {
        if (show) {
            fetchUserStage()
        }
        else {
            setStageList([])
        }
    }, [show])
    const formItems = [
        {
            label: `阶段`,
            name: 'stageIdentification',
            type: 'stage',
            select: stageList.map(val => {
                const {
                    stageInfo = {},
                    subStageInfoList = []
                } = val
                const { chooseFlag } = stageInfo
                if (subStageInfoList.length > 0) {
                    return {
                        ...stageInfo,
                        ...val,
                        subStageInfoList
                    }
                }
                return {
                    ...stageInfo,
                }
            })
        },


    ];
    const modalProps = {
        title: '认领',
        width: 900,
        visible: show,
        maskClosable: true,
        destroyOnClose: true,
        zIndex: 1001,
        confirmLoading: loading,
    };
    const handleUpAudit = () => {

        form.validateFields().then(async (values) => {
            const { stageIdentification } = values
            onChange({
                stage: stageIdentification,
                userIdList: [id],
            })
            onClose()
        });
    };
    return (
        <Modal {...modalProps} onCancel={onClose} onOk={handleUpAudit}>
            <Space direction={'vertical'} style={{ display: 'flex', textAlign: 'center', justifyContent: 'center', width: '100%' }}>
                <FormCondition form={form} formItems={formItems}></FormCondition>
            </Space>

        </Modal >
    );
}
export default connect(({ order, loading }) => ({
    loading: loading.effects['user/fetchUserStageForChoose'],
}))(ClaimUser); 